<template>
  <div style="margin-top: 30px;margin-left:200px; width: 700px;">
    <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="100px"
      class="demo-ruleForm"
    >
            <el-form-item label="用户名" prop="username">
                <el-input type="text"
                          v-model="ruleForm.username"
                          readOnly=readOnly
                ></el-input>
            </el-form-item>
            <el-form-item label="密码" prop="password">
                <el-input type="password"
                          v-model="ruleForm.password"
                ></el-input>
            </el-form-item>
            <el-form-item label="姓名" prop="name">
                <el-input type="text"
                          v-model="ruleForm.name"
                ></el-input>
            </el-form-item>
            <el-form-item label="性别">
                <el-radio-group v-model="ruleForm.sex">
                    <el-radio-button label="男"></el-radio-button>
                    <el-radio-button label="女"></el-radio-button>
                </el-radio-group>
                <el-date-picker
                    style="float:right;"
                    v-model="ruleForm.birthday"
                    type="date"
                    placeholder="出生日期"
                    >
                </el-date-picker>
            </el-form-item>
            <el-form-item label="电话" prop="phone">
                <el-input type="text"
                          v-model="ruleForm.phone"
                ></el-input>
            </el-form-item>
            <el-form-item label="邮箱" prop="email">
                <el-input type="text"
                          v-model="ruleForm.email"
                ></el-input>
            </el-form-item>
            <el-form-item label="家庭地址" prop="area">
                <el-input type="text"
                          v-model="ruleForm.area"
                ></el-input>
            </el-form-item>
            <el-form-item label="职业方向" prop="expectIndustry">
                <el-input type="text"
                          v-model="ruleForm.expectIndustry"
                ></el-input>
            </el-form-item>
            <el-form-item label="具体职业" prop="expectJob">
                <el-input type="text"
                          v-model="ruleForm.expectJob"
                ></el-input>
            </el-form-item>
            <el-form-item label="期望薪资" prop="expectSalary">
                <el-input type="text"
                          v-model="ruleForm.expectSalary"
                ></el-input>
            </el-form-item>
            <el-form-item label="期望城市" prop="expectCity">
                <el-input type="text"
                          v-model="ruleForm.expectCity"
                ></el-input>
            </el-form-item>
            <el-form-item label="个人总结" prop="summary">
                <el-input type="text"
                          v-model="ruleForm.summary"
                ></el-input>
            </el-form-item>
            <el-form-item label="工作经历" prop="experience">
                <el-input type="text"
                          v-model="ruleForm.experience"
                ></el-input>
            </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm('ruleForm')">立即修改</el-button>
        <el-button @click="resetForm('ruleForm')">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
  category: null,
  data() {
    return {
      ruleForm: {
        rid:'',
        username:'',
        password:'',
        name:'',
        phone:'',
        email:'',
        sex:'',
        birthday:'',
        area:'',
        expectIndustry:'',
        expectJob:'',
        expectSalary:'',
        expectCity:'',
        summary:'',
        experience:'',
      },
      rules: {
        username: [{ required: true, message: "用户名无法修改", trigger: "readOnly"  }],
        }
    };
  },
  methods: {
    handleChange(value) {
      console.log(value);
    },
    submitForm(formName) {
      const _this = this;
      this.$refs[formName].validate(valid => {
        //提交后台
         if (valid) {
                        axios.put('http://localhost:8182/resume/update',_this.ruleForm).then(function (resp) {
                            if(resp.data.code == 0){
                                _this.$alert(_this.ruleForm.name+'修改成功', '', {
                                    confirmButtonText: '确定',
                                    callback: action => {
                                        _this.$router.push('/resume')
                                    }
                                });
                            }
                        })
                    }
                });
                },
            
    resetForm(formName) {
      this.$refs[formName].resetFields();
    }
  },
  //拿后台数据
    created(){
      const _this = this;
      axios.get('http://localhost:8182/resume/findById/'+_this.$route.query.id).then(function(resp){
        _this.ruleForm=resp.data.data
      })
      /* console.log(_this.$route.query.id) */
    }
};
</script>
